// 1.引入了react的依赖
import React from 'react';
// 2.react-dom是react提供的对于dom操作的上层的API
import ReactDOM from 'react-dom';
// 3.引入了一个index.css样式
import './index.css';
// 4.引入App组件
import App from './App';
import reportWebVitals from './reportWebVitals';
// 引入antd-mobile 样式
import 'antd-mobile/dist/antd-mobile.css';  // or 'antd-mobile/dist/antd-mobile.less'
ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

// import { Component } from "react";
// import ReactDOM from "react-dom";
// // ReactDOM.createPortal(<App/>,el)
// // 1.定义一个获取页面元素的方法
// const getDiv = () => {
//   let div = document.createElement("div");
//   document.body.append(div);
//   return div;
// };
// // 2.定义一个高阶组件
// function withProtal(WrapperComponent) {
//   return class Protal extends Component {
//     constructor(props) {
//       super(props);
//       this.el = getDiv();
//     }
//     render() {
//       return ReactDOM.createPortal(<WrapperComponent />, this.el);
//     }
//   };
// }

// class Test extends Component {
//   render() {
//     return <h1>hello world!</h1>;
//   }
// }
// const Protal = withProtal(Test); //高阶组件 接收一个组件 返回一个组件
// class App extends Component{
//   render(){
//     return <div>
//       <h1>App 组件</h1>
//       <Protal></Protal>
//     </div>
//   }
// }
// ReactDOM.render(
//   <App />,
// document.getElementById('root')
// );